<!-- 
-------------------------------------------------
-------------------------------------------------
		CONTENT BELOW ARE FOR PROTOTYPING!!!
-------------------------------------------------
-------------------------------------------------
 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:hx="http://aliok.com.tr">
	<body>
		<ui:composition >
	
			<!-- even if not specified, tags below may define the global attributes: 
				accesskey classp contenteditable contextmenu dir draggable hidden
				id itemid itemprop itemref itemscope itemtype lang spellcheck style
				tabindex title
			and global event attributes:
				onabort	onblurp	oncanplay oncanplaythrough onchange onclick oncontextmenu ondblclick ondrag
				ondragend ondragenter ondragleave ondragover ondragstart ondrop	ondurationchange onemptied
				onended	onerror	onfocus	onformchange onforminput oninput oninvalid onkeydown onkeypress
				onkeyup onload onloadeddata onloadedmetadata onloadstart onmousedown onmousemove
				onmouseout onmouseover onmouseup onmousewheel onpause onplay onplaying onprogress 
				onratechange onreadystatechange onscroll onseeked onseeking onselect onshow onstalled
				onsubmit onsuspend ontimeupdate onvolumechange onwaiting
			 -->
	
			<!--
				REFS:
					http://www.whatwg.org/specs/web-apps/current-work/#text-state-and-search-state
				CURRENT BROWSER SUPPORT:
					this part is written for each attribute below
				ATTRIBUTES:
					type: 'text' or 'search'		('search' is supported on Chrome 4.0, Safari 4.0.4, Opera 10.10)
					pattern: pattern to validate the typed input on browser-side		(not supported on any browser yet)
					suggestions: suggestion values		(supported on Opera 10.10)
					required: same with h:inputText 'required' except, 'required' attribute of HTML 'input' element is used this time		(not supported on any browser yet)
					placeholder: hint to show on the input, when it is clear	(supported on Chrome 4.0 and Safari 4.0.4, )
				NOTES:
					THIS COMPONENT extends h:inputText(or t:inputText)
			-->
			<!-- ---------------------------------------usage 1(simple) --------------------------------------------------- -->
			<hx:inputText value="#{someBean.someField}" type="text"/>
				
			<!-- expected HTML5 code -->
			<input type="text" value="DefaultInput" />
			
			
			
			
			
			
			<!-- -------------------------usage 2(using search type and required attribute) -------------------------------- -->
			<hx:inputText value="#{someBean.someField}" type="search" required="true"/>
				
			<!-- expected HTML5 code-->
			<input type="search" value="DefaultInput" required/>
			
			
			
			
			
			
			<!-- -------------------------usage 3(using pattern attribute) -------------------------------- -->
			<hx:inputText value="#{someBean.someField}" type="text" pattern="[0-9][A-Z]{3}" title="A part number is a digit followed by three uppercase letters."/>
				
			<!-- expected HTML5 code-->
			<input type="text" value="DefaultInput" pattern="[0-9][A-Z]{3}" title="A part number is a digit followed by three uppercase letters."/>
					<!-- Not typing the input can result a browser alert: 
						A part number is a digit followed by three uppercase letters.
						You cannot complete this form until the field is correct.
					-->
			
			
			
			
			
			
			
			
			<!-- -------------------------usage 4(using pattern attribute) -------------------------------- -->
			<hx:inputText value="#{someBean.someField}" type="text" pattern="[0-9][A-Z]{3}" title="A part number is a digit followed by three uppercase letters."/>
				
			<!-- expected HTML5 code-->
			<input type="text" value="DefaultInput" pattern="[0-9][A-Z]{3}" title="A part number is a digit followed by three uppercase letters."/>
					<!-- Not typing the input can result a browser alert: 
						A part number is a digit followed by three uppercase letters.
						You cannot complete this form until the field is correct.
					-->
			
			
			
			
			
			
			
			
			<!-- -------------------------usage 5(using suggestions attribute with static text) ----------------------------- -->
			<hx:inputText type="text" value="#{someBean.tool}" suggestions="Hammer,Screwdriver"/>
				
			<!-- expected HTML5 code-->
			<input type="text" value="" list="idOfDataList"/>
			<datalist id="idOfDataList">
				<option value="Hammer" label="Hammer" />
				<option value="Screwdriver" label="Screwdriver" />
			</datalist>
			
			
			
			
			
			
			
			<!-- -------------------------usage 6(using suggestions attribute) ----------------------------- -->
			<hx:inputText type="search" value="#{someBean.city}" suggestions="#{someBean.citySuggestions}"/>
				
			<!-- expected HTML5 code-->
			<input type="search" value="1" list="idOfDataList"/>
			<datalist id="idOfDataList">
				<option value="0" label="Istanbul" />
				<option value="1" label="New York" />
				<option value="2" label="Berlin" />
			</datalist>
			
			
			
			
			
			<!-- -------------------------usage 7(using placeholder attribute) ----------------------------- -->
			<hx:inputText type="search" value="#{someBean.city}"
				placeHolder="Type a city name"/>
				
			<!-- expected HTML5 code-->
			<input type="search" value="1" placeholder="Type a city name"/>
			<!-- browser is expected to show 'Type a city name' when the input is empty. -->
			
			
		</ui:composition>
	</body>
</html>